<template>
    <div class="main">
        <a-form :inline="false" :model="formData" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" size="small"
            labelAlign="left">
            <a-collapse v-model="activeKey">
                <a-collapse-panel key="1">
                    <span slot="header" class="collapseHeader">
                        <a-icon type="setting" />基本设置
                    </span>
                    <a-form-item label="节点ID">
                        <a-input placeholder="请输入" :disabled="onlyRead" v-model="formData.id"></a-input>
                    </a-form-item>
                    <a-form-item label="节点名称">
                        <a-input placeholder="请输入" :disabled="onlyRead" v-model="formData.name"></a-input>
                    </a-form-item>
                    <a-form-item label="节点描述">
                        <a-textarea placeholder="请输入" v-model="formData.documentation"
                            :autoSize="{ minRows: 2, maxRows: 5 }" />
                    </a-form-item>
                    <a-form-item label="异步">
                        <a-switch checked-children="开" un-checked-children="关" v-model="formData.async" />
                    </a-form-item>
                </a-collapse-panel>
            </a-collapse>
        </a-form>
    </div>
</template>

<script>
import mixinPanel from "../../common/mixinPanel"
import { commonParse } from '../../common/parseElement'
export default {
    mixins: [mixinPanel],
    props: {
        onlyRead: {
            type: Boolean,
            default: false
        },
        modeler: {
            type: Object,
            required: true
        }
    },
    data() {
        return {
            formData: {
                id: '',
                name: '',
                code: '',
                description: ''
            }
        }
    },
    watch: {
        'formData.async': function (val) {
            if (val === '') val = null
            this.updateProperties({ 'flowable:async': val })
        }
    },
    methods: {},
    created() {
        this.formData = commonParse(this.element)
    }
}
</script>

<style>

</style>